<#include "/admin/inc/page.html">
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户 - UnaBoot</title>
    <link rel="icon" href="${una}/ub-admin/img/favicon.png" type="image/x-icon">
    <link rel="shortcut icon" href="${una}/ub-admin/img/favicon.png" type="image/x-icon">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <link rel="stylesheet" href="${una}/ub-admin/plugin/fontawesome-free/css/all.min.css">
    <link rel="stylesheet" href="${una}/ub-admin/css/font-awesome.css">
    <link rel="stylesheet" href="${una}/ub-admin/css/ionicons.css">
    <link rel="stylesheet" href="${una}/ub-admin/css/adminlte.css">
    <link rel="stylesheet" href="${una}/ub-admin/plugin/layer/skin/default/layer.css">
    <link rel="stylesheet" href="${una}/ub-admin/css/unaboot-admin.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700">
</head>
<body class="sidebar-mini layout-fixed layout-navbar-fixed text-md <!--sidebar-collapse-->">
    <div class="wrapper">
        <nav class="main-header navbar navbar-expand navbar-white navbar-light">
            <#include "/admin/inc/header.html">
        </nav>
        <aside class="main-sidebar sidebar-dark-primary ">
            <#include "/admin/inc/aside.html">
        </aside>
        <div class="content-wrapper bg-gray-custom">
            <div class="content-header pb-0">
                <div class="row mb-2">
                    <div class="col-12">
                        <h4 class="ml-2 mb-0 text-dark">用户 <a href="${una}/admin/users/create" class="btn btn-sm btn-outline-primary">添加用户</a></h4>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="container-fluid">
                    <!--条件查找-->
                    <div class="row text-sm">
                        <div class="col-12">
                            <div class="pull-left post-select">
                                <a href="${una}/admin/users/" class="post-current">全部<span class="count">（${all!'0'}）</span></a> |
                                <a href="${una}/admin/users/role/admin" >管理员<span class="count">（${admin!'0'}）</span></a>
                            </div>
                        </div>
                    </div>
                    <!--过滤选项栏-->
                    <div class="row text-sm mt-1">
                        <div class="col-12">
                            <form id="select-form" class="form-inline form-row">
                                <select class="form-control form-control-sm mb-2 mr-sm-2" name="role">
                                    <option value="all" selected>所有角色</option>
                                    <#list roles as role>
                                        <#if current?? && current != "" && current == role.getName()>
                                            <option value="${role.getName()}" selected>${role.getAlias()}</option>
                                        <#else>
                                            <option value="${role.getName()}">${role.getAlias()}</option>
                                        </#if>
                                    </#list>
                                </select>
                                <button type="button" id="select-btn" class="btn btn-sm btn-primary ml-2 mb-2"> 筛选</button>
                            </form>
                        </div>
                    </div>
                    <!--数据列表-->
                    <div class="row text-sm mt-1">
                        <div class="col-12">
                            <table class="table post-datatable table-striped table-hover" style="border: 1px solid #ddd">
                                <thead>
                                    <tr class="bg-white">
                                        <td width="30%">用户名</td><td>别名</td><td>电子邮箱</td><td>角色</td><td>文章</td><td>日期</td>
                                    </tr>
                                </thead>
                                <tbody>
                                    <#if data?? && data.content?size gt 0>
                                        <#list data.content as user>
                                            <tr>
                                                <td>
                                                    <img src="${user.avatar!una+'/ub-admin/img/avatar-32x32.png'}" style="width: 24px;height: 24px;" class="mr-1">
                                                    <#if user.state == 0>
                                                        ${user.username}
                                                    <#else>
                                                        <a href="javascript:void(0);">${user.username}</a>
                                                    </#if>
                                                    <div class="row-actions">
                                                        <#if user.state == 0 && user.locked gt -1>
                                                            <span class="open">
                                                                <a href="javascript:void(0);" aria-id="${user.id}" class="text-green"><i class="fa fa-smile-o"></i>启用</a>
                                                            </span>
                                                        </#if>
                                                        <#if user.state == 1 && user.locked gt -1>
                                                            <span class="edit">
                                                                <a href="${una}/admin/users/${user.id}"><i class="fa fa-edit"></i>编辑</a> <small class="text-secondary"> |</small>
                                                            </span>
                                                            <span class="category">
                                                                <a href="javascript:void(0);" aria-id="${user.id}"><i class="fa fa-cogs"></i>栏目</a> <small class="text-secondary"> |</small>
                                                            </span>
                                                            <span class="trash">
                                                                <a href="javascript:void(0);" aria-id="${user.id}"><i class="fa fa-trash-o"></i>移除</a> <small class="text-secondary"> |</small>
                                                            </span>
                                                            <span class="reset">
                                                                <a href="javascript:void(0);" aria-id="${user.id}" class="text-secondary"><i class="fa fa-undo"></i>重置</a> <small class="text-secondary"> |</small>
                                                            </span>
                                                            <span class="forbidden">
                                                                <a href="javascript:void(0);" aria-id="${user.id}" class="text-secondary"><i class="fa fa-frown-o"></i>禁用</a>
                                                            </span>
                                                        </#if>
                                                    </div>
                                                </td>
                                                <td>
                                                    <#if user.state == 0>
                                                        ${user.nickname!'Unnamed'}
                                                    <#else>
                                                        <a href="javascript:void(0);">${user.nickname!'Unnamed'}</a>
                                                    </#if>
                                                    </td>
                                                <td>
                                                    <#if user.state == 0>
                                                        ${user.email!'Undefined'}
                                                    <#else>
                                                        <a href="javascript:void(0);">${user.email!'Undefined'}</a></td>
                                                    </#if>
                                                <td>
                                                    <span class="tag tag-red">
                                                        <#switch user.role>
                                                            <#case "admin"> 管理员<#break>
                                                            <#case "editor"> 编辑员<#break>
                                                            <#case "member"> 会员<#break>
                                                            <#default> 来宾用户
                                                        </#switch>
                                                    </span>
                                                </td>
                                                <td>
                                                    <#if user.locked == -1>
                                                        —
                                                    <#else>
                                                        <a href="javascript:void(0);" aria-user="${user.id}" title="点击查看该用户的文章数量">
                                                            <i class="fa fa-files-o"></i>
                                                        </a>
                                                    </#if>
                                                </td>
                                                <td>
                                                    注册于<br>
                                                    <span class="post-time"><i class="fa fa-calendar-o"></i> ${user.createTime?string("yyyy-MM-dd")}</span>
                                                </td>
                                            </tr>
                                        </#list>
                                    <#else>
                                        <tr><td colspan="6" class="text-center text-secondary">暂无可用数据!</td></tr>
                                    </#if>
                                </tbody>
                                <tfoot>
                                    <tr class="bg-white">
                                        <td width="30%">用户名</td><td>别名</td><td>电子邮箱</td><td>角色</td><td>文章</td><td>日期</td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                    <!--分页按钮-->
                    <div class="row text-sm mt-1">
                        <#if data?? && data.content?size gt 0 && data.totalPages gt 1>
                            <div class="col-12">
                                <nav aria-label="..." class="pull-right">
                                    <@pagination una+"/admin/users/" data 9/>
                                </nav>
                            </div>
                        </#if>
                    </div>
                </div>
            </div>
        </div>
        <footer class="main-footer">
            <#include "/admin/inc/footer.html">
        </footer>
    </div>
    <script src="${una}/ub-admin/plugin/jquery/jquery.min.js" type="text/javascript"></script>
    <script src="${una}/ub-admin/plugin/bootstrap/js/bootstrap.bundle.min.js" type="text/javascript"></script>
    <script src="${una}/ub-admin/js/adminlte.js" type="text/javascript"></script>
    <script src="${una}/ub-admin/plugin/layer/layer.js"></script>
    <script src="${una}/ub-admin/js/unaboot-admin.core.js" type="text/javascript"></script>
    <script type="text/javascript">
        $("#select-btn").on("click",function(){
           var role = $("select[name='role'] option:selected").val();
           if(role=="all"){
               window.location.href = "${una}/admin/users/";
           }else{
               window.location.href = "${una}/admin/users/role/"+role;
           }
        });
        $(".forbidden a").on("click",function(){
            var id = $(this).attr("aria-id");
            if(id == null || typeof(id) == 'undefined' ){
                return false;
            }else{
                layer.alert("确定禁用该用户吗?",{
                    title:"<i class='fa fa-info-circle'></i> 提示",
                    icon:0,
                    btn:['是(Y)','否(N)'],
                    shadeClose: false,
                    shade:[0.4,'#fff'],
                    anim: 1
                },function(){
                    var load = layer.load(2,{shade:[0.4,'#f0f0f0']});
                    $.ajax({
                        type:'PUT',
                        url:"${una}/admin/users/"+id+"/close",
                        success:function(){
                            layer.close(load);
                            layer.alert("当前操作已成功执行!",{
                                title:"<i class='fa fa-info'></i> 提示",
                                icon:1,
                                shade:[0.4,"#fff"],
                                shadeClose:false,
                                time:0,
                                btn:['OK'],
                                yes:function(index){
                                    layer.close(index);
                                    window.location.reload();
                                }
                            });
                        },
                        error:function(){
                            layer.close(load);
                            layer.alert("当前操作失败!请稍后再试。",{
                                title:"<i class='fa fa-info'></i> 提示",
                                icon:1,
                                shade:[0.4,"#fff"],
                                shadeClose:false,
                                time:0,
                                btn:['Close'],
                                yes:function(newIndex){
                                    layer.close(newIndex);
                                }
                            });
                        }
                    });
                },function(index){
                    layer.close(index);
                });
            }
        });
        $(".open a").on("click",function(){
            var id = $(this).attr("aria-id");
            if(id == null || typeof(id) == 'undefined' ){
                return false;
            }else{
                layer.alert("确定启用该用户吗?",{
                    title:"<i class='fa fa-info-circle'></i> 提示",
                    icon:0,
                    btn:['是(Y)','否(N)'],
                    shadeClose: false,
                    shade:[0.4,'#fff'],
                    anim: 1
                },function(){
                    var load = layer.load(2,{shade:[0.4,'#f0f0f0']});
                    $.ajax({
                        type:'PUT',
                        url:"${una}/admin/users/"+id+"/open",
                        success:function(){
                            layer.close(load);
                            layer.alert("当前操作已成功执行!",{
                                title:"<i class='fa fa-info'></i> 提示",
                                icon:1,
                                shade:[0.4,"#fff"],
                                shadeClose:false,
                                time:0,
                                btn:['OK'],
                                yes:function(index){
                                    layer.close(index);
                                    window.location.reload();
                                }
                            });
                        },
                        error:function(){
                            layer.close(load);
                            layer.alert("当前操作失败!请稍后再试。",{
                                title:"<i class='fa fa-info'></i> 提示",
                                icon:1,
                                shade:[0.4,"#fff"],
                                shadeClose:false,
                                time:0,
                                btn:['Close'],
                                yes:function(newIndex){
                                    layer.close(newIndex);
                                }
                            });
                        }
                    });
                },function(index){
                    layer.close(index);
                });
            }
        });
        $(".reset a").on("click",function(){
            var id = $(this).attr("aria-id");
            if(id == null || typeof(id) == 'undefined' ){
                return false;
            }else{
                layer.open({
                    type:2,
                    title:"<i class=\"fa fa-undo\"></i> 重置账号",
                    shadeClose:false,
                    shade:0.4,
                    offset:['55px'],
                    area:['400px','350px'],
                    content:"${una}/admin/users/"+id+"/pwd",
                    resize:false,
                    anim:1
                });
            }
        });
        $(".category a").on("click",function(){
            var id = $(this).attr("aria-id");
            if(id == null || typeof(id) == 'undefined' ){
                return false;
            }else{
                layer.open({
                    type:2,
                    title:"<i class=\"fa fa-cogs\"></i> 用户可操作目录设置",
                    shadeClose:false,
                    shade:0.4,
                    offset:['55px'],
                    area:['400px','550px'],
                    content:"${una}/admin/users/"+id+"/categories",
                    resize:false,
                    anim:1
                });
            }
        });
    </script>
</body>
</html>